﻿body {
}
#Message{
    width: 790px;
    color: #ff6666;
    font-size: 16px;
    position: absolute;
    top: 80px;
    left: 10px;
}
/********* News Formatting *********/
#NewsReel{
    width: 400px;
    float: left;
    margin: 0%;
    position: absolute;
    top: 100px;
    left: 0px;
}
.newsItem{
    padding: 0px;
    margin: 0px;
    width: 400px;
    position: relative;
    top: 10px;
}
.newsHeadLine{
    padding-left: 5px;
    color: #444444;
    font-size: 20px;
    font-weight: bold;
    text-align:left;

}
.newsDate{
    padding-right: 5px;
    float: right;
    color: #444444;
    font-size: 20px;
    font-weight: bold;
    text-align:right;

}
.newsDetails{
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 10px;
    float: right;
    width: 390px;
    border-top: 5px double #000000;
}
/********* Character List Formatting *********/
#CharacterList{
    width: 400px;
    float: left;
    margin: 0%;
    position: absolute;
    top: 100px;
    left: 400px;
}
.charButton{
    margin-left: 5px;
    margin-bottom: 5px;
    width: 390px;
}
/********* Character Details Formatting *********/
#Blackout{
    width: 100%;
    height: 100%;
    background-color: #00ffff;
    opacity: 0.6;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 10;

}
#CharacterDetails{
    width:400px;
   /* Border: 5px solid #00ffff;*/
    height: 530px;
    background-color: #00ffff;
    position: absolute;
    top: 100px;
    left: 400px;
    z-index: 20;
}
#lblName{
    width:55px;
    position: absolute;
    top: 5px;
    left: 0px;
}
#txtName{
    width:290px;
    position: absolute;
    top: 5px;
    left: 60px;
}

#lblPoints{
    width:130px;
    position: absolute;
    top: 40px;
    left: 0px;

}
#lblAvailable{
    width:60px;
    position: absolute;
    top: 40px;
    left: 135px;
}

#lblDescription{
    position: absolute;
    top: 200px;
    left: 0px;
}
#txtDescription{
    position: absolute;
    width: 393px;
    height: 250px;
    top: 230px;
    left: 0px;
}

.lblStat{
    top: 70px;
    width: 80px;
    text-align: center;
}
#lblHP{
    position: absolute;
    left: 0px;
}
#lblMP{
    position: absolute;
    left: 80px;
}
#lblStr{
    position: absolute;
    left: 160px;
}
#lblDex{
    position: absolute;
    left: 240px;
}
#lblInt{
    position: absolute;
    left: 320px;
}

.statVal{
    top: 140px;
    width: 80px;
    text-align: center;
}
#charHP{
    position: absolute;
    left: 0px;
}
#charMP{
    position: absolute;
    left: 80px;
}
#charStr{
    position: absolute;
    left: 160px;
}
#charDex{
    position: absolute;
    left: 240px;
}
#charInt{
    position: absolute;
    left: 320px;
}

.up{
    top:105px;
    width: 80px;
}
.down{
    top:170px;
    width: 80px;
}
#btnHPup{
    position: absolute;
    left: 0px;
}
#btnHPdown{
    position: absolute;
    left: 0px;
}
#btnMPup{
    position: absolute;
    left: 80px;
}
#btnMPdown{
    position: absolute;
    left: 80px;
}
#btnSTRup{
    position: absolute;
    left: 160px;
}
#btnSTRdown{
    position: absolute;
    left: 160px;
}
#btnDEXup{
    position: absolute;
    left: 240px;
}
#btnDEXdown{
    position: absolute;
    left: 240px;
}
#btnINTup{
    position: absolute;
    left: 320px;
}
#btnINTdown{
    position: absolute;
    left: 320px;
}

#btnSave{
    width: 60px;
    position: absolute;
    left: 275px;
    top: 500px;
}
#btnPlay{
    width: 60px;
    position: absolute;
    left: 340px;
    top: 500px;
}
#btnClose{
    width: 30px;
    height: 20px;
    position: absolute;
    left: 370px;
    top: 0px;
}
